import React from 'react';
import { history } from 'umi'
import { Button } from 'antd';
import { PageContainer } from '@/molecules';
import authHelper from '@/utils/auth/helper';
import { useWorkFlow } from '@/hooks';
import Process from './Process';

const { checkCode } = authHelper;

const tabList = [
    {
        key: '1',
        tab: '调岗中',
        code: true,
        component: <Process appendQuery={{ searchType: 1 }} />
    },
    {
        key: '2',
        tab: '历史记录',
        code: true,
        component: <Process appendQuery={{ searchType: 2 }} />
    }
];

const List = ({ location }) => {
    const { query = {} } = location;
    const filterTabList = tabList.filter(item => checkCode(item.code));

    const activeKey = query.activeKey ?? filterTabList[0]?.key;

    const handleTabChange = key => {
        history.push({ query: { activeKey: key } });
    };

    const { launch } = useWorkFlow({ launchParam: { type: 'TransferPositionApply' } });

    return (
        <PageContainer
            tabList={filterTabList}
            activeTabKey={activeKey}
            onTabChange={handleTabChange}
            tabBarExtraContent={
                <Button
                    type="primary"
                    onClick={() => {
                        launch();
                    }}
                    style={{ marginTop: 11 }}
                >
                    发起调岗申请
                </Button>
            }
        >
            {filterTabList?.find(item => item.key === activeKey)?.component}
        </PageContainer>
    );
};

export default List;
